<template>
	<view class="content">
		<view class="" style="position: absolute; top: 0; width: 100%;">
			<image src="../../static/images/work1.jpg" mode="" class="img_bg"></image>
			<view class="display justify-start margin-b60 margin-t30 margin-l30 margin-r30">
				<view class="margin-l54" style="text-align: center;">
					<image src="/static/user.png" class="avatar"></image>
				</view>
				<view class="myOther roll">
					<view class="text-bold text-48">员工姓名：{{userDetail.nickname}}</view>
					<view class="">员工账号：{{userDetail.username}}</view>
					<view class="">{{userDetail.juese}}</view>
				</view>
				<!-- <button type="primary" open-type="getUserInfo" @getuserinfo="getuserinfo">微信授权</button> -->
			</view>
			<view class="list-item margin-l30 margin-r30" @click="toCenter">
				<image class="item-image" src="../../static/name.png"></image>
				<text class="item-text">个人中心</text>
				<image class="image-jiantou" src="../../static/leftjiantou2.png"></image>
			</view>
			<view class="line"></view>
			<view class="list-item margin-l30 margin-r30" @click="toMyTask()">
				<image class="item-image" src="../../static/test1.png"></image>
				<text class="item-text">我的任务</text>
				<image class="image-jiantou" src="../../static/leftjiantou2.png"></image>
			</view>
			<view class="line"></view>
			<!-- #ifdef MP-WEIXIN -->
			<view class="list-item margin-l30 margin-r30" @click="toPush()">
				<image class="item-image" src="../../static/work/h.png"></image>
				<text class="item-text">隐患预警推送</text>
				<image class="image-jiantou" src="../../static/leftjiantou2.png"></image>
			</view>
			<view class="line"></view>
			<!-- #endif -->
			<!-- <view class="text-left card padding-l30 margin-l30 margin-r30 ">
			 <view class="text-36 text-bold "style="border-bottom: solid #808080 1upx;">个人信息</view>
			<view class="border-bottom display justify-between align-center">
				<view class="text-32 padding-t30 padding-b30">工种</view>
				<view class="text-28 font-gray1 padding-r30">{{danger_listMenu.danger_name?danger_listMenu.danger_name:'-'}}</view>
			</view>
			<view class="border-bottom display justify-between align-center">
				<view class="text-32 padding-t30 padding-b30 ">邮箱</view>
				<view class="text-28 font-gray1 padding-r30">{{danger_listMenu.danger_level_show?danger_listMenu.danger_level_show:'-'}}</view>
			</view>
		 
			<view class="border-bottom display justify-between align-center">
				<view class="text-32 padding-t30 padding-b30 ">电话</view>
				<view class="text-28 font-gray1 padding-r30">{{danger_listMenu.danger_position?danger_listMenu.danger_position:'-'}}</view>
			</view>
			<view class="border-bottom display justify-between align-center">
				<view class="text-32 padding-t30 padding-b30">所属部门</view>
				<view class="text-28 font-gray1 padding-r30">{{danger_listMenu.position_id?danger_listMenu.position_id:'-'}}</view>
			</view>
			<view class="display justify-between align-center">
				<view class="text-32 padding-t30 padding-b30">出生日期</view>
				<view class="text-28 font-gray1 padding-r30">{{danger_listMenu.charge_userid_show?danger_listMenu.charge_userid_show:'-'}}</view>
			</view>
			<view class="display justify-between align-center">
				<view class="text-32 padding-t30 padding-b30">年龄</view>
				<view class="text-28 font-gray1 padding-r30">{{danger_listMenu.charge_userid_show?danger_listMenu.charge_userid_show:'-'}}</view>
			</view>
		 </view> -->


			<!-- <view class="text-left card padding-l30 margin-l30 margin-r30 margin-t30">
			 <view class="text-36 text-bold "style="border-bottom: solid #808080 1upx;">更多信息</view>
			 <view class="display flex-wrap align-start text-30">
				 <view class="box1 margin-l40">
				 	<view class="mt ">
						培训记录
				 	</view>
				 </view>
				 <view class="box-green margin-l40">
				 	<view class="mt" @click="toTextclick">
				 		考试记录
				 	</view>
				 </view>
				 <view class="box-orange margin-l40">
				 	<view class="mt">
				 		隐患记录
				 	</view>
				 </view>
				 <view class="box-orange margin-l40">
				 	<view class="mt">
				 		巡查记录
				 	</view>
				 </view>
				 <view class="box-blue margin-l40">
				 	<view class="mt">
				 		两单一卡
				 	</view>
				 </view>
			 </view>
		 </view> -->
			<!-- 	<view class="">
				<button type="default"@click="a">123</button>
			</view> -->
			<!-- <view>
				<web-view :webview-styles="webviewStyles" src="https://aqmore.sxpz.vip//upload/file/20200823/5f42707721102.docx"></web-view>
			</view> -->

			<view class="margin-l30 margin-r30 margin-b100 my-top">
				<view class="bigButton text-bold text-36 " @tap="edit">退出登录</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				uid:'',
				token:'',
				userDetail: {},
				webviewStyles: {
					progress: {
						color: '#FF3333'
					}
				}
			}
		},
		methods: {
			toPush(){
				uni.navigateTo({
					url:'center/center'
				})
			},
			// 个人中心
			toCenter(){
				/* uni.request({
					url: 'https://aqmore.sxpz.vip/AppApi/WeiXin/is_bing?uid=' + this.uid + '&token=' + this.token,
					method: 'GET',
					header: {
						'content-type': 'application/x-www-form-urlencoded'
						},
						success(res) {
							console.log(res)
							if(res.data.code == 400){
								uni.navigateTo({
									url:'center/center'
								})
							}
						}
				}) */
				uni.showToast({
					title:'该功能暂未开放!',
					icon:'none'
				})
			},
			toMyTask(){
				uni.navigateTo({
					url:'myTask/myTask'
				})
			},
			toTextclick(){
				uni.navigateTo({
					url:'./exam'
				})
			},
			a() {
				uni.downloadFile({
					url: 'https://aqmore.sxpz.vip//upload/file/20200823/5f42707721102.docx',
					success: function(res) {
						var filePath = res.tempFilePath;
						uni.openDocument({
							filePath: filePath,
							success: function(res) {
								console.log('打开文档成功');
							}
						});
					}
				});
			},
			edit() {
				uni.reLaunch({
					url: '/pages/index/index'
				})
				try {
					uni.removeStorageSync('user');
					console.log('chenggonmg')
				} catch (e) {
					// error
				}
			},
			/* getuserinfo: function(res1) {
				console.log(res1)
				if (!res1.detail.iv) {
					uni.showToast({
						title: '您取消了授权',
						icon: 'none'
					})
					return false
				}
				uni.login({
					provider: 'weixin',
					success: function(res2) {
						console.log(res2)
						//获取sessionkey
						uni.request({
							url: 'https://hoa.hcoder.net/xcxencode/?c=sk&appid=wx51de9d1dbba3eedc&secret=015e80bda60a1fd8303da0bf5dc5bf36&code=' +
								res2.code,
							success: function(res3) {
								console.log(res3)
							},
							fail: function(res4) {
								console.log(res4)
							}
						})
					}
				})
				uni.navigateTo({
					url: '../workspace/workDetial/subscribe/subscribe'
				})
			} */
		},
		onShow() {
			this.userDetail = uni.getStorageSync("user");
			
		},
		
		onLoad() {
			this.uid = uni.getStorageSync("user").uid;
			this.token = uni.getStorageSync("user").token;
		}
	}
</script>

<style>
	page {
		margin: 0;
		top: 0;
		height: 100%;
		width: 100%;
		/* background-color: #FFFFFF; */
	}

	.content {
		margin: 0;
		padding: 0;
		height: 100%;
		width: 100%;
	}

	.display {
		display: flex;
	}

	.justify-start {
		justify-content: flex-start;
	}

	.margin-b60 {
		margin-bottom: 60upx;
	}

	.margin-l30 {
		margin-left: 30upx;
	}

	.margin-r30 {
		margin-right: 30upx;
	}

	.margin-b100 {
		margin-bottom: 30upx;
	}

	.avatar {
		width: 165upx;
		height: 165upx;
		background: rgba(102, 102, 102, 1);
		border-radius: 50%;
		border: 4upx solid #3F5EFF;
	}

	.my-top {
		margin-top: 90%;
	}

	.myOther {
		height: 165upx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-start;
		margin-left: 30upx;
		margin-top: 30upx;
	}

	.roll {
		margin-left: 30upx;
		margin-right: 30upx;

	}

	.list-item {
		display: flex;
		flex-direction: row;
		align-items: center;
		width: 100%;
		height: 100%;
		margin-top: 10rpx;
		position: relative;
		/*父元素位置要设置为相对*/
	}

	.item-image {
		width: 50rpx;
		height: 50rpx;
		margin: 20rpx;
	}

	.item-text {
		width: 50%;
		color: aliceblue;
		font-size: 35upx;
		margin-left: 20upx;
	}

	.image-jiantou {
		width: 20upx;
		height: 35upx;
		position: absolute;
		/* 要约束所在位置的子元素的位置要设置成绝对 */
		right: 30upx;
		/* 靠右调节 */
		margin-right: 35upx
	}

	.line {
		width: 80%;
		height: 3upx;
		background: lightgray;
		margin-left: 90rpx;
		margin-right: 90upx;
	}

	.bigButton {
		height: 98upx;
		line-height: 98upx;
		background: linear-gradient(90deg, rgba(63, 94, 255, 1), rgba(34, 150, 255, 1));
		box-shadow: 0 2upx 10upx 0 rgba(52, 115, 255, 0.8);
		border-radius: 49upx;
		color: #fff;
	}

	.text-bold {
		font-weight: bold;
		text-align: center;
	}

	.text-36 {
		font-size: 36upx;
	}


	.box1 {
		line-height: 40upx;
		margin-top: 30upx;
		text-align: center;
		height: 110upx;
		width: 110upx;
		background-color: #00aa00;
		border-radius: 10%;
	}

	.box-green {
		line-height: 40upx;
		margin-top: 30upx;
		text-align: center;
		height: 110upx;
		width: 110upx;
		background-color: #00aa00;
		border-radius: 10%;
	}

	.box-orange {
		line-height: 40upx;
		margin-top: 30upx;
		text-align: center;
		height: 110upx;
		width: 110upx;
		background-color: #ffaa00;
		border-radius: 10%;
	}

	.box-blue {
		line-height: 40upx;
		margin-top: 30upx;
		text-align: center;
		height: 110upx;
		width: 110upx;
		background-color: #00aaff;
		border-radius: 10%;
	}

	.mt {
		margin-top: 18upx;
	}
</style>
